<template>
	<view class="weather">
		<view class="top">
			<input type="text" v-model="city" @input="search()"/>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			city: '广州' // 搜索城市
		},
		onShow() {
			this.search();
		},
		methods:{
			// 搜索天气
			search() {
				wx.request({
					url: `https://restapi.amap.com/v3/weather/weatherInfo?key=5d2d3e6c0d5188bec134fc4fc1b139e0&city=${this.city}&extensions=base`,
					method:'GET',
					success(resp) {
						console.log(resp);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.weather {
		.top{
			width: 100%;
			height: 200rpx;
			input {
				width: 80%;
				height: 60rpx;
				margin: 50rpx auto;
				box-sizing: border-box;
				padding-left: 30rpx;
				border: 1rpx solid #FFFFFF;
				border-radius: 30rpx;
				background-color: #FFFFFF;
			}
		}
	}
</style>
